<template>
  <div class="flex items-center justify-between mb-4">
    <div>
      <el-button
        v-if="keys.includes('create')"
        type="primary"
        size="small"
        @click="$emit('create')"
        >新增</el-button
      >
      <el-button
        v-if="keys.includes('delete')"
        type="danger"
        size="small"
        @click="$emit('delete')"
        >批量删除</el-button
      >
    </div>

    <el-tooltip effect="dark" content="刷新数据" placement="top">
      <el-button text @click="$emit('refresh')">
        <el-icon :size="20">
          <Refresh />
        </el-icon>
      </el-button>
    </el-tooltip>
  </div>
</template>

<script setup>
import { computed } from 'vue'
const props = defineProps({
  layout: {
    type: String,
    default: 'create,refresh',
  },
})
const keys = computed(() => props.layout.split(','))
defineEmits(['create', 'delete', 'refresh'])
</script>
